import React, { Fragment } from 'react';
import { CloseCircleTwoTone } from '@ant-design/icons';
import { Button, Row, Col } from 'antd';
import router from 'umi/router';
import Result from '@/components/Result';
import downloadFile from '@/utils/utils';
import styles from './style.less';

class ErrorPage extends React.PureComponent {
  render() {
    const { resultInfo, setPageState } = this.props;
    const information = (
      <div className={styles.information} style={{ lineHeight: '32px' }}>
        {resultInfo.errorCount ? (
          <Row>
            <h3 style={{ fontWeight: 900 }}>您提交的内容存在异常：</h3>
          </Row>
        ) : null}
        {resultInfo.batchName ? (
          <Row>
            <Col span={4} className={styles.label}>
              任务名称：
            </Col>
            <Col span={8}>{resultInfo.batchName}</Col>
          </Row>
        ) : null}
        {/* <Row>
          <Col span={4} className={styles.label}>
            导入数据：
          </Col>
          <Col span={4}>{resultInfo.taskCount}条</Col>
        </Row>
        <Row>
          <Col span={resultInfo.errorCount ? 5 : 4} className={styles.label}>
            {resultInfo.errorCount ? (
              <Icon type="check-circle" theme="twoTone" twoToneColor="#52c41a" />
            ) : null}{' '}
            成功数据：
          </Col>
          <Col span={resultInfo.errorCount ? 3 : 4}>{resultInfo.successCount}条</Col>
        </Row> */}

        {resultInfo.errorCount ? (
          <Row>
            <Col span={5} className={styles.label}>
              <CloseCircleTwoTone twoToneColor="red" /> 失败数据：
            </Col>
            <Col span={3}>{resultInfo.errorCount}条</Col>
            <Col span={5}>
              <a onClick={() => downloadFile(resultInfo.errorParams, resultInfo.errorUrl, 'POST')}>
                下载错误数据
              </a>
            </Col>
          </Row>
        ) : null}
      </div>
    );
    const actions = (
      <Fragment>
        <Button type="primary" onClick={() => router.goBack()}>
          关闭
        </Button>
        <Button onClick={() => setPageState(false)}>上一步</Button>
      </Fragment>
    );
    return (
      <Result
        type={resultInfo.errorCount ? 'error' : 'success'}
        title={resultInfo.errorCount ? '操作失败' : '操作成功'}
        extra={information}
        actions={actions}
        className={styles.result}
      />
    );
  }
}

export default ErrorPage;
